<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>{:session('cp.cpsysname')}--商户管理平台</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="{:config('webconfig.description');}">
    <meta name="keywords" content="{:config('webconfig.keywords');}">
    <meta name="author" content="runoob">
    <link rel="stylesheet" href="__STATIC_URL__/static/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/index.css"/>
    <script src="__STATIC_URL__/static/js/jquery-2.1.4.min.js"></script>
    <script src="__STATIC_URL__/static/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="__STATIC_URL__/static/js/commen.js" type="text/javascript" charset="utf-8"></script>
    <style>
        thead tr th {
            text-align: center;
        }

        tbody tr td {
            text-align: center;
        }

        td a.glyphicon-qrcode:hover {
            cursor: pointer;
        }
    </style>
</head>
<body>
{include file='public/header'/}
<!------------------导航-------------------------->
<section id="content">
    {include file='public/left'/}
    <!--------------------------主要内容区域------------------------------------->
    <div class="content">
        <div class="page-heading  mgl15 mgr15">
            <!--路径导航-->
            <ol class="breadcrumb">
                <li>当前位置是:</li>
                <li>
                    <a href="{:url('cardus/cardinfo',['card_id'=>$card['card_id']])}">会员卡</a>
                </li>
                <li class="active">渠道二维码</li>
            </ol>
        </div>

        <div class="panel mgl15 mgr15">
            <div class="panel-heading addCharts" style="background:#ededed;overflow: hidden;line-height: 32px;">渠道列表
                {if condition="checkPath('cardus/qrcodeadd')"}
                <a href="{:url('cardus/qrcodeadd',['card_id'=>$card['card_id']])}" class="btn btn-info" style="float: right">添加渠道</a>
                {/if}
            </div>
            <div class="panel-body">
                <table class="table table-bordered" data-toolbar="#toolbar">
                    <thead>
                    <tr>
                        <th>投放渠道</th>
                        <th>二维码</th>
                        <th>创建时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    {volist name="list" id="vo"}
                    <tr>
                        <td>{$vo.mid|getmachname}</td>
                        <td><a class="glyphicon glyphicon-qrcode" data-url="{$vo.qrcode_url}" onclick="showModal(this)" ></a></td>
                        <td>{$vo.create_time}</td>
                        <td class="chakan">
                            {if condition="checkPath('cardus/qrcodeedit')"}
                            <a class="btn-link" href="{:url('cardus/qrcodeedit',array('id'=>$vo['id'],'card_id'=>$vo['card_id']))}">修改</a>
                            {/if}
                            {if condition="checkPath('cardus/qrcodedel')"}
                            <a class="btn-link" href="{:url('cardus/qrcodedel',['id'=>$vo['id'],'card_id'=>$vo['card_id']])}">删除</a>
                            {/if}
                        </td>
                    </tr>
                    {/volist}
                    </tbody>
                </table>
            </div>
        </div>
        {include file='public/footer'/}
    </div>
</section>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">×
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    二维码
                </h4>
            </div>
            <div class="modal-body">
                <ul id="myTab" class="nav nav-tabs">
                    <li class="active">
                        <a href="#home" data-toggle="tab">
                            二维码
                        </a>
                    </li>
                </ul>
                <div id="myTabContent" class="tab-content">
                    <div class="tab-pane fade in active" id="home">
                        <img src="" alt="" style="width: 230px;height: auto;"/>
                        <a href=""  id="codeone">
                            <button type="button" class="btn btn-primary" style="display: block;margin:0 auto;">
                                点击下载
                            </button>
                        </a>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default"
                        data-dismiss="modal">关闭
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script>
    function showModal(id){
        var url1 = $(id).data("url");
        $("#home img").attr("src", url1);
        $("#codeone").attr("href", url1);
        if(url1){
            $('#myModal').modal('show')
        }else{
            layer.alert("二维码不存在")
        }
    }
    $(function () {
//        $('#myModal').on('show.bs.modal', function () {
//            var url1 = $(event.target).data("url");
//            $("#home img").attr("src", url1);
//            $("#codeone").attr("href", url1).attr("download","渠道二维码");
//        })
        $('#myModal').on('hide.bs.modal', function () {
            $("#home img").attr("src", '');
            $("#codeone").attr("href", '#');
        });
    })
</script>
</body>


</html>
